<!--
 * @Description: 
 * @Version: 2.0
 * @Autor: swc
 * @Date: 2024-07-23 09:51:08
 * @LastEditors: swc
 * @LastEditTime: 2024-08-29 08:52:39
-->

<template>
  <div class="nodeDataEditor">
    <div class="checker" v-if="isShow">
      <o-simple-table
        :allowEdit="true"
        :disabled="true"
        :onlyEdit="true"
        :data="nodeData"
        :columns="columns"
        :compBoxInfo="GT_compBoxInfo"
        @onSaveRow="onSaveRow($event)"
      />
    </div>
  </div>
</template>

<script lang="ts">
import { Cell } from '@antv/x6';
import { T_srv, Tsrv, ifs, vue } from './config';

@T_srv.comp
export default class nodeDataEditor extends vue {
  /* 父组件compBoxInfo */
  @T_srv.prop({
    required: false,
    type: Object,
    default: null
  })
  compBoxInfo: ifs.I_compBoxInfo;

  // @T_srv.prop({
  //   required: false,
  //   type: Object,
  //   default: null
  // })
  // config: Object;

  @T_srv.prop({
    required: false,
    type: Cell,
    default: null
  })
  selectCell: Cell;

  @T_srv.prop({
    required: false,
    type: Boolean,
    default: false
  })
  isShow: boolean;

  @T_srv.watch('selectCell')
  onSelectCellChange(val: any) {
    this.handleColumn().then(() => {
      //
    });
  }

  /* 组件名 */
  private name: string = 'nodeDataEditor';

  private funName: string = 'nodeDataEditor';

  private G_compName: string = this.name;

  /* 组件箱信息对象 */
  private GT_compBoxInfo: ifs.I_compBoxInfo;

  /* 组件箱对象 */
  private GT_compBox: ifs.I_compBox;

  /* 组件箱识别ID */
  private G_compID: string;

  /* 遮罩 */
  // public isMask: boolean = false;

  private columns: Array<any> = [];

  private nodeData: Array<any> = [];

  created() {
    // 如果父组件没有传参，那就产生一个
    this.GT_compBoxInfo = Tsrv.getCompInfo(this.compBoxInfo);
    this.G_compID = this.GT_compBoxInfo.compID;
    this.GT_compBox = this.GT_compBoxInfo.TcompBox;
    this.init();
  }

  mounted() {
    /* 向父组件发送实例 */
    this.GT_compBox.addCompMergeName(this.G_compID, this.G_compName, this);
    this.$emit('compBoxInfo', this.GT_compBoxInfo);
  }

  destroyed() {
    /* 注册组件销毁 */
    this.GT_compBox.removeCompMergeName(this.G_compID, this.G_compName);

    /* 如果父组件传入的compBoxInfo则删除本文件产生的引用,反之是本组件产生的ID统一删除 */
    if (Tsrv.utils.isEmpty(this.compBoxInfo)) {
      this.GT_compBox.removeCompsWithCompID(this.G_compID);
    } else {
      this.GT_compBox.removeCompsMergeName(this.G_compID, [
        `'${this.G_compName}'`
      ]);
    }
  }

  private init() {
    this.funName = 'nodeDataEditor'; // 当前配置中的功能名
  }

  private handleColumn(): Promise<boolean> {
    return new Promise((resolve, reject) => {
      const cell = this.selectCell;
      if (cell) {
        if (cell.isNode()) {
          const prop = cell.getProp();
          if (prop.shape === 'bpmn-activity') {
            this.columns = [
              {
                title: '审核人',
                slot: 'checker',
                editComp: {
                  type: 'm2o',
                  props: {
                    tTable: '_sys_user',
                    // tField: 'id',
                    tField: 'user_no',
                    vField: 'user_name'
                  }
                }
              }
            ];
            // 获取自定义节点data属性及其值
            if (prop?.data && prop.data?.checker) {
              // this.nodeData.push({ checker: prop.data?.checker });
              this.nodeData = [
                {
                  checker: prop.data?.checker.value,
                  checker_label: prop.data?.checker.label
                }
              ];
            }
          } else if (prop.shape === 'bpmn-gateway') {
            this.columns = [
              {
                title: '条件',
                slot: 'condition',
                editComp: {
                  type: 'm2o',
                  props: {
                    tTable: '_sys_publicprocess',
                    tField: 'f_name',
                    vField: 'f_name'
                  }
                }
              }
            ];
            // 获取自定义节点data属性及其值
            if (prop?.data && prop.data?.condition) {
              this.nodeData = [
                {
                  condition: prop.data?.condition.value,
                  // eslint-disable-next-line camelcase
                  condition_label: prop.data?.condition.label
                }
              ];
            }
          }
        } else {
          //
        }
      }
      resolve(true);
    });
  }

  onSaveRow(e: any) {
    let data: any = null;
    const prop = this.selectCell.getProp();
    const row = e.data[0];
    if (prop.shape === 'bpmn-activity') {
      data = {
        checker: {
          value: row['checker'],
          label: row['checker_label']
        }
      };
    } else if (prop.shape === 'bpmn-gateway') {
      data = {
        condition: {
          value: row['condition'],
          label: row['condition_label']
        }
      };
    }
    const bpmn = this.GT_compBox.getCompMergeName(this.G_compID, 'cBpmn');
    if (!Tsrv.noValue(data)) {
      bpmn.GT_command.modifyCellData(this.selectCell.id, data);
    }
    // bpmn.GT_command.modifyCellData(this.selectCell.id, data);
  }

  onCellDblclick(e) {
    if (e?.row) {
      // const row = Tsrv.utils.clone(e.row);
      // row[Tsrv.globalVar.fieldName.graphData] = wUnZipStr(?
      //   row[Tsrv.globalVar.fieldName.graphData]
      // );
      // this.$emit('cell-dblclick', row);
    }
  }

  onRowChange(e) {
    if (e?.data?.to?.row) {
      // const graph: any = this.$refs.graph;
      // graph.reLoadDataFromJson(
      //   wUnZipStr(e.data.to.row[Tsrv.globalVar.fieldName.graphData])?
      // );
    }
  }
}
</script>
<style lang="scss" scoped>
// .nodeDataEditor {
//   //
// }
</style>
